<template>
  <span>
    <template v-if="size > Math.pow(bs,0) && size < Math.pow(bs,1)">
      {{ size + '&nbsp;B' }}
    </template>
    <template v-if="size > Math.pow(bs,1) && size < Math.pow(bs,2)">
      {{ (size / Math.pow(bs,1)).toFixed(2) + '&nbsp;KB' }}
    </template>
    <template v-if="size > Math.pow(bs,2) && size < Math.pow(bs,3)">
      {{ (size / Math.pow(bs,2)).toFixed(2) + '&nbsp;MB' }}
    </template>
    <template v-if="size > Math.pow(bs,3) && size < Math.pow(bs,4)">
      {{ (size / Math.pow(bs,3)).toFixed(2) + '&nbsp;GB' }}
    </template>
    <template v-if="size > Math.pow(bs,4) && size < Math.pow(bs,5)">
      {{ (size / Math.pow(bs,4)).toFixed(2) + '&nbsp;TB' }}
    </template>
  </span>
</template>
<script>
export default {
  props:{
    size:Number,
  },
  data () {
    return {
      bs:1024
    }
  },
  methods: {},
  mounted: function() {},
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>
@import url('../assets/config.less');

</style>